<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>字体大小属性(font size attribute)</title>
  <!-- 
  font-size 是CSS属性，用于设置文本的字体大小。font-size 属性的总结： 
 
    1.  font-size: medium; ：默认值，使用浏览器的中等字体大小。 
    2.  font-size: xx-small | x-small | small | large | x-large | xx-large; ：使用预定义的相对字体大小。 
    3.  font-size: smaller | larger; ：相对于父元素的字体大小设置更小或更大。 
    4.  font-size: length; ：使用固定的字体大小，可以使用像素（px）、em、rem等长度单位。 
    5.  font-size: percentage; ：使用相对于父元素的百分比设置字体大小。 
    
    通过设置 font-size 属性，可以控制文本的字体大小，使文本在页面中呈现出合适的视觉效果。
  -->
    <style>
      .font-size {
        font-size: 20px;
      }

      .children {
        /* 1.使用: px */
        font-size: 30px;
        /* 2.使用: em */
        font-size: 2em;
        /* 3.使用: % */
        font-size: 230%;
        /* 4.使用: rem */
        font-size: 2rem;
      }
    </style>
</head>
<body>

  <div class="font-size">
    <div class="children">
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quaerat!
    </div>
  </div>

  <div class="font-size-attribute">
    font-size 是CSS属性，用于设置文本的字体大小.
  </div>
  
</body>
</html>